<template>
    <div class="page">
        <div class="search">
            <el-row class="btn-group">
                <el-col :span="3" :offset="18">
                    <el-button type="primary" @click="editAdmin({},false)">新建管理员</el-button>
                </el-col>
                <el-col :span="3">
                    <el-button type="warning" v-print="'#printContent'">打印表格</el-button>
                </el-col>
            </el-row>
        </div>
        <el-table :data="adminList" border id="printContent">
            <el-table-column prop="admin_id" label="编号" width="110" sortable></el-table-column>
            <el-table-column prop="admin_name" label="姓名" width="110" sortable></el-table-column>
            <el-table-column prop="admin_type" label="级别">
                <template slot-scope="scope">
                    {{adminType[scope.row.admin_type]}}
                </template>
            </el-table-column>
            <el-table-column prop="admin_phone" label="联系方式"></el-table-column>
            <el-table-column prop="admin_password" label="登录密码" ></el-table-column>
            <el-table-column prop="remark" label="备注"></el-table-column>
            <el-table-column prop="option" label="操作">
                <template slot-scope="scope">
                    <el-button size="small" type="warning" @click="editAdmin(scope.row,true)" plain>编辑</el-button>
                    <el-button size="small" type="danger" @click="deleteAdmin(scope.row)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-dialog title="编辑数据" :visible.sync="dialogVisible">
            <adminEditor :form ="admin" :disable="isEdit"
                @closeDialog="dialogVisible=false" @refresh="refresh"></adminEditor>
        </el-dialog>
    </div>
</template>
<script>
import adminEditor from './base/admin-editor';
export default {
    name:'admin',
    components:{
        adminEditor
    },
    data(){
        return{
            adminList:[],
            dialogVisible:false,
            admin:{},
            isEdit:false,
            adminType:["超级管理员","普通管理员"]
        }
    },
    methods:{
        getAdminList(){
            this.$http.get('/api/admin/getAdminList').then((res)=>{
                console.log(res);
                this.adminList = res.data;
            }).catch((err)=>{
                console.log(err);
            })
        },
        deleteAdmin(admin){
            this.$confirm('是否确认删除该管理员信息?','提示',{
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(()=>{
                let id = admin.admin_id;
                this.$http.post("/api/admin/deleteAdmin",{
                    admin_id:id
                }).then((res)=>{
                    if(res.status == 200){
                        this.$message({
                            type: 'success',
                            message: '删除成功!'
                        });
                        let index = this.adminList.findIndex(obj => obj.admin_id == admin.admin_id)
                        this.adminList.splice(index, 1);
                    }
                })
            })
        },
        editAdmin(admin,isEdit){
            this.admin = admin
            this.isEdit = isEdit
            this.dialogVisible = true;
        },
        refresh(){
            this.getAdminList()
        }
    },
    mounted(){
        this.getAdminList();
    },
    computed:{
        disable(){
            let admin = this.$cookies.get("admin")
            return admin.admin_type == 0;
        }
    }
}
</script>